<template>
  <div class="insureEli_conter">
    <div style="text-align:right;margin-top: 10px;margin-right: 30px">
      <el-button type="primary" @click="getBack">返回</el-button>
    </div>
    <el-row class="row_top">
      <el-col :span="24">
        <div class="top_img" style="text-align: center">
          <img src="../../../assets/images/img.png" height="62" width="507"/>
        </div>
      </el-col>
<!--      <el-col :span="6">-->
<!--        <div class="grid-content ">-->
<!--          <span> 投保类型:</span>-->
<!--          <span style="margin-left: 5px">{{ title }}</span>-->


<!--        </div>-->

<!--      </el-col>-->
    </el-row>
    <el-row class="el-row">
      <el-col :span="24">
        <div class="title">雇主责任保险（A）投保单 <span>No.</span></div>
      </el-col>

    </el-row>

    <el-row class="el-row">
      <el-col :span="24">
        <div class="explain">欢迎您到中国人寿财产保险股份有限公司投保！请您在投保前务必详细阅读相关保险条款，特别注意<span>责任免除、投保人及被保险人义务、赔偿处理</span>等内容，据实回答保险人就投保事项提出的相关询问，并用蓝色或黑色墨水笔如实填写投保单及附件。投保后相关内容若发生变动，请及时通知保险人。
        </div>
      </el-col>
    </el-row>


    <!--   中间内容添加投保信息-->

    <div class="tem_from">
      <el-row class="el-row">
        <el-col :span="24">
          <div class="grid-content1"><h3>1. 投保人信息</h3></div>
        </el-col>
      </el-row>
      <el-row class="el-row" style="display: flex;flex-flow: wrap">

          <div class="grid-content" style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">投保人姓名:</span>
            <span>{{ formData.name1 }}</span>
          </div>
          <div style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">联系人姓名:</span>
            <span>{{ formData.contactPerson1}}</span>
          </div>
          <div style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">联系电话:</span>
            <span>{{ formData.phone1 }}</span>
          </div>
          <div style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">通讯地址:</span>
            <span>{{ formData.mailAddress1 }}</span>
          </div>
          <div style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">邮编:</span>
            <span>{{ formData.emailCode1}}</span>
          </div>
          <div style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">电子邮箱:</span>
            <span>{{ formData.email1}}</span>
          </div>
      </el-row>
      <el-row class="el-row" >
        <el-col :span="24">
          <div class="grid-content1"><h3>2. 被保险人基本信息</h3></div>
        </el-col>
      </el-row>
      <el-row class="el-row">
          <div class="grid-content" style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">被保险人名称:</span>
            <span>{{ formData.name2 }}</span>
          </div>

          <div style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">联系人姓名:</span>
            <span>{{ formData.contactPerson2 }}</span>
          </div>

          <div style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">联系电话:</span>
            <span>{{ formData.phone2 }}</span>
          </div>

          <div style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">通讯地址:</span>
            <span>{{ formData.mailAddress2}}</span>
          </div>
          <div style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">邮编:</span>
            <span>{{ formData.emailCode2}}</span>
          </div>
          <div style="margin-right: 20px">
            <span style="font-weight:600;margin-right: 5px">电子邮箱:</span>
            <span>{{ formData.email2 }}</span>
          </div>
      </el-row>
      <el-row class="el-row">

          <div class="grid-content1"><h3>3. 被保险人性质:</h3></div>
          <div class="grid-content">{{ formData.nature2}}</div>
      </el-row>
      <el-row class="el-row">
          <div class="grid-content">请说明所在行业:</div>
          <div class="grid-content1">{{ formData.industry }}</div>
      </el-row>
      <el-row class="el-row">

          <div class="grid-content1" style="margin-right: 20px"><h3>4. 被保险人地址/营业场所:</h3></div>

          <div>{{ formData.address2}}</div>

      </el-row>
      <el-row class="el-row">
          <div class="grid-content1" style="margin-right: 20px"><h3>5. 被保险人营业范围:</h3></div>

          <div>{{ formData.businessScope2}}</div>
      </el-row>
      <el-row class="el-row">

          <div class="grid-content1" style="margin-right: 20px"><h3>6. 被保险人工作人员总人数:</h3></div>

          <div>{{ formData.staffCount2}}<span style="margin-left: 5px">人</span></div>

      </el-row>

      <el-row class="el-row ">
        <el-col :span="24">
          <div class="grid-content" style="width: 700px;">
            <div style="margin-bottom: 10px"> 其中高级职员姓名，职务，健康情况，请说明:</div>
            <div v-if="formData.seniorDescription!=''" style="border: 1px solid #d9d9d9 ;padding: 5px;border-radius: 6px">{{ formData.seniorDescription }}</div>
          </div>

        </el-col>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="grid-content" style="width: 700px;">
            <div style="margin-bottom: 10px"> 其他类型工作人员说明（如工作类型、人数、健康情况）:</div>
            <div v-if="formData.generalDescription!=''" style="border: 1px solid #d9d9d9 ;padding: 5px;border-radius: 6px">{{ formData.generalDescription }}</div>
          </div>
        </el-col>

      </el-row>
      <el-row>
        <el-col :span="7">
          <div class="grid-content bg-purple"> 注：如必要，请附工作人员基本情况清单。</div>
        </el-col>

      </el-row>
      <el-row class="el-row ">
          <div class="grid-content1" style="margin-right: 20px"><h3>7. 过去三年是否投保过与雇主责任相关的保险？</h3></div>
          <div>{{ formData.isELI }}</div>
        <div class="grid-content" style="margin: 0 20px">过去三年损失情况如何？</div>
        <div>{{ formData.isLossEli }}</div>
      </el-row>

      <div v-if="formData.isELI=='是' || formData.isLossEli=='有'">
        <el-row>
          <el-col :span="5">
            <div class="grid-content">如果有，请说明:</div>
          </el-col>
          <el-col :span="4">
            <div>
              保险期间
            </div>
          </el-col>
          <el-col :span="4">
            <div>
              保险人数
            </div>
          </el-col>
          <el-col :span="4">
            <div>
              损失情况
            </div>
          </el-col>
          <el-col :span="4">
            <div>
              获赔情况
            </div>
          </el-col>
        </el-row>

        <el-row  v-if="formData.eliDesc==null">
          <el-col>
            <div style="border: 1px solid #d9d9d9 ;padding: 5px;width: 700px;margin-left: 20px;border-radius: 6px">{{ formData.eliDesc }}</div>
          </el-col>
        </el-row>
      </div>
      <el-row class="el-row ">
          <div class="grid-content1"><h3>8. 是否按照《工伤保险条例》参加工伤保险？</h3></div>
          <div>{{ formData.isII }}</div>
      </el-row>
      <div v-if="formData.isII=='是'">
        <el-row>
          <el-col :span="7">
            <div class="grid-content">如果是，过去三年被保险人参加工伤保险的情况:</div>
          </el-col>
          <el-col :span="4">
            <div>
              保险期间
            </div>
          </el-col>
          <el-col :span="4">
            <div>
              保险人数
            </div>
          </el-col>
          <el-col :span="4">
            <div>
              损失情况
            </div>
          </el-col>
          <el-col :span="4">
            <div>
              获赔情况
            </div>
          </el-col>
        </el-row>
        <el-row v-if="formData.iiDesc!=''">
          <el-col>
            <div style="border: 1px solid #d9d9d9 ;padding: 5px;width: 700px;margin-left: 20px;border-radius: 6px">{{ formData.iiDesc }}</div>
          </el-col>
        </el-row>
      </div>
      <el-row class="el-row ">
          <div class="grid-content1" style="margin-right: 20px"><h3>9. 工作人员上岗前，是否经过岗位培训？</h3></div>
          <div>{{ formData.isTrain }}</div>
      </el-row>

      <el-row v-if="formData.isTrain=='是'">
        <el-col :span="4">
          <div class="grid-content"> 培训时间一般多长？</div>
        </el-col>
        <el-col :span="4">
          <div>{{ formData.trainingTime }}<span style="margin-left: 5px">月</span></div>
        </el-col>
      </el-row>
      <el-row class="el-row ">
          <div class="grid-content1" style="margin-right: 20px"><h3>10. 是否拥有专职医疗人员？</h3></div>
          <div>{{ formData.isHaveMedicalStaff }}</div>
      </el-row>
      <el-row v-if="formData.isHaveMedicalStaff=='有'">
        <el-col :span="4">
          <div class="grid-content"> 如果有，请列明数量:</div>
        </el-col>
        <el-col :span="4">
          <div>{{ formData.medicalStaffCount }}</div>

        </el-col>
      </el-row>
      <el-row class="el-row ">
          <div class="grid-content1" style="margin-right: 20px"><h3>11.与最近的医院的距离:</h3></div>

          <div>{{ formData.hospitalDistance }}</div>


      </el-row>
      <el-row  class="el-row ">
          <div class="grid-content" style="margin-right: 20px">请提供医院名称:</div>
          <div>{{ formData.hospitalName }}</div>
      </el-row>
      <el-row class="el-row ">
          <div class="grid-content1" style="margin-right: 20px"><h3>12.是否全部工作人员参加医疗保险？</h3></div>
          <div>{{ formData.isJoinMi }}</div>
      </el-row>
      <el-row class="el-row " v-if="formData.isJoinMi=='是'">
          <div class="grid-content" style="margin-right: 20px">如果否，请说明情况：</div>
          <div>{{ formData.descriptionMi }}</div>
      </el-row>
      <el-row class="el-row ">
          <div class="grid-content1" style="margin-right: 20px"><h3>13. 劳动合同中对被保险人工作人员伤、残或死亡及职业性疾病等规定的赔偿原则及限额:</h3>
            <div v-if="formData.compPrincipleAndLimit!=''" style="border: 1px solid #d9d9d9 ;padding: 5px;width: 700px;margin-left: 20px;border-radius: 6px">{{ formData.compPrincipleAndLimit }}</div>
          </div>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="grid-content bg-purple">经保险人要求，被保险人应将与工作人员签订的劳动合同复印件交由保险人存档。</div>
        </el-col>
      </el-row>
      <el-row  class="el-row ">

          <div class="grid-content1" style="margin-right: 20px"><h3>14.其他需要特别说明的情况</h3>
            <div v-if="formData.otherDescription!=''" style="border: 1px solid #d9d9d9 ;padding: 5px;width: 700px;margin-left: 20px;border-radius: 6px">{{ formData.otherDescription }}</div>
          </div>
      </el-row>
      <el-row>
        <el-col :span="24">
          <div class="grid-content2">以下为投保信息</div>
        </el-col>
      </el-row>
      <el-row class="el-row ">
          <div class="grid-content1"><h3>15.</h3></div>
      </el-row>
      <div v-for="(item,index) in ProductPlan" :key="index">
        <div style="margin: 10px 20px;font-weight: bold">{{ item.name }}</div>
        <el-row class="el-row ">

          <div class="grid-content" ><span style="font-weight: bold;">( 1 ) 每人伤亡责任限额(小写):</span><span
              style="margin-left: 5px">{{item.casualties }}</span><span
              style="margin-left: 5px">元</span></div>
          <div class="grid-content" ><span style="font-weight: bold">(大写):</span><span style="margin-left: 5px">{{ item.casualties_s }}</span></div>
        </el-row>
        <el-row class="el-row ">
          <div class="grid-content" ><span style="font-weight: bold">( 2 ) 每人医疗费用责任限额(小写):</span><span
              style="margin-left: 5px">{{ item.medical }}</span><span style="margin-left: 5px">元</span></div>
          <div class="grid-content" ><span style="font-weight: bold">(大写):</span><span style="margin-left: 5px">{{ item.medical_s }}</span></div>
        </el-row>
        <el-row class="el-row ">
          <div class="grid-content" ><span style="font-weight: bold">( 3 )累计责任限额（小写）:</span><span
              style="margin-left: 5px">{{ item.liability }}</span><span style="margin-left: 5px">元</span></div>
          <div class="grid-content"><span style="font-weight: bold">(大写):</span><span style="margin-left: 5px">{{ item.liability_s }}</span></div>
        </el-row>
        <el-row class="el-row ">

          <div class="grid-content" ><span style="font-weight: bold">( 4 )每次事故每人医疗费用免赔额（小写）:</span><span
              style="margin-left: 5px">{{ item.deductibles }}</span><span style="margin-left: 5px">元</span></div>
          <div class="grid-content" ><span style="font-weight: bold">(大写):</span><span style="margin-left: 5px">{{ item.deductibles_s }}</span></div>
        </el-row>

        <el-row class="el-row ">
          <div class="grid-content" style="font-weight: bold">( 5 ) 保险费率</div>
          <div>{{ item.insurance_rate }}<span v-if="item.insurance_rate!=null" style="margin-left: 5px"> ‰</span></div>
        </el-row>
        <el-row class="el-row ">

          <div class="grid-content" ><span style="font-weight: bold">( 6 ) 误工费限额:</span><span
              style="margin-left: 5px">100元/天 , 免赔三天</span></div>

        </el-row>
        <el-row class="el-row ">

          <div class="grid-content" ><span style="font-weight: bold">( 7 ) 住院津贴限额:</span><span
              style="margin-left: 5px">60元/天 , 免赔三天</span></div>
        </el-row>
      </div>

      <el-row class="el-row ">
          <div class="grid-content1" style="margin-right: 20px"><h3>16.保险期间</h3></div>
          <div style="display: flex;align-items: center;flex-flow: wrap">
            <span style="width: 70px"> 1月，自</span>
            <span style="margin: 0 5px">
                {{ formData.insuranceTimeStart }}

              </span>
            <span style="width: 60px;margin-left: 10px"> 零时起</span>
            <span style="margin: 0 5px">
                {{ formData.insuranceTimeEnd }}
               </span>
            <span style="margin-left: 10px"> 二十四时止。</span>
          </div>
      </el-row>
      <el-row class="el-row ">

          <div class="grid-content1" style="display: flex;align-items: center"><h3>17. 总保险费</h3><span style="font-weight: bold">(小写):</span><span
            style="margin-left: 5px;margin-top: 5px" >{{ formData.sinsuranceFeeCount }}</span><span style="margin-left: 5px" v-if="formData.sinsuranceFeeCount!=null">元</span>
          </div>

          <div class="grid-content"><span style="font-weight: bold">(大写):</span><span style="margin-left: 5px">{{ formData.sinsuranceFeeCounts }}</span></div>

      </el-row>
      <el-row class="el-row ">
          <div class="grid-content1"><h3>18. 保险费支付日:</h3></div>
          <div>{{ formData.payTime }}</div>
      </el-row>
      <el-row class="el-row ">

          <div class="grid-content1" style="margin-right: 20px"><h3>19. 保险合同争议解决方式选择:</h3></div>

          <div>{{ formData.solution }}</div>
      </el-row>
      <!--        特别约定1-->
      <div >
        <div class="conter" >
          <el-row>
            <el-col :span="2">
              <h3>20.特别约定</h3>
            </el-col>
          </el-row>
          <div v-for="(item,index) in ProductPlan" :key="index">

            <div style="margin-bottom: 50px">
              <div style="font-weight: bold;margin-left: 20px;margin-bottom: 20px">{{ item.name }}</div>
              <div style="margin-left: 20px;">
                {{item.specifically_agreed}}
              </div>
            </div>
          </div>
        </div>
        <el-row>
          <el-col :span="24">
            <div class="grid-content ">
              <span style="font-weight: bold;margin-left: 30px">投保人声明:</span>
              保险人已将《雇主责任保险条款》（包括责任免除部分）向本人做了明确说明，本人已充分理解；上述所填写的内容均属实，同意以此投保单及附件作为订立保险合同的依据。
            </div>
          </el-col>
        </el-row>
        <el-row>

          <el-col :span="19">
            <div class="grid-content " style="text-align: right ;margin-right: 5px">
              投保人（签章）:
            </div>
          </el-col>
          <el-col :span="4">
            <div style="width: 160px;" v-if="formData.seal!=''">
              <el-image
                style="width:100px; height: 100px"
                :src="url+formData.seal"
                :preview-src-list="[url+formData.seal]">
              </el-image>
            </div>
          </el-col>
        </el-row>
        <el-row>

          <el-col :span="19">
            <div class="grid-content " style="text-align: right ;margin-right: 5px">
              日期:
            </div>
          </el-col>
          <el-col :span="5">
            <div>{{ formData.signingTime }}</div>

          </el-col>
        </el-row>
        <el-row>
          <el-col :span="2">
            <div class="grid-content ">
              承保性质:
            </div>
          </el-col>
          <el-col :span="13">
            <div>{{ formData.underwriting }}</div>
            <!--              <el-radio-group v-model="formData.underwriting">-->
            <!--                <el-radio label="1">新保</el-radio>-->
            <!--                <el-radio label="2">续保</el-radio>-->

            <!--              </el-radio-group>-->

          </el-col>
          <el-col :span="8">
            <div class="grid-content " style="text-align: right;">
              业务员/代理人姓名:<span>{{ formData.agent }}</span>
            </div>
          </el-col>

        </el-row>
        <el-row>
          <el-col :span="2">
            <div class="grid-content ">
              公司网址
            </div>
          </el-col>
          <el-col :span="6">
            <a style="color: dodgerblue">www.chinalife-p.com.cn</a>
          </el-col>
          <el-col :span="4">
            <div> 服务电话：95519</div>
          </el-col>

        </el-row>
        <div>
          <el-row>
            <el-col :span="24">
              <div class="grid-content " style="text-align: center">

                <img src="../../../assets/images/Application.png" height="88" width="690"/></div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <h2 class="grid-content " style="text-align: center">
                免责条款特别提示
              </h2>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div>尊敬的客户：</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="margin-left: 60px">非常感谢您向我们投保 <span
                style="font-weight: bold;text-decoration:underline">雇主责任保险</span>，请仔细阅读保险条款，特别是以下责任免除条款，我们现向您作明确说明，请您认真听取并予以足够的重视：
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">下列原因造成的损失、费用和责任，保险人不负责赔偿:</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（一）投保人、被保险人及其代表的故意行为;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（二）战争、敌对行动、军事行为、武装冲突、罢工、骚乱、暴动、恐怖活动;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（三）核辐射、核爆炸、核污染及其他放射性污染;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（四）大气污染、土地污染、水污染及其他各种污染;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（五）行政行为或司法行为;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（六）被保险人的工作人员犯罪或者违反法律、法规的;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（七）被保险人的工作人员醉酒导致伤亡的;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（八）被保险人的工作人员自残或者自杀的;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">
                （九）在工作时间和工作岗位，被保险人的工作人员因投保时已患有的疾病发作或分娩、流产导致死亡或者在48小时之内经抢救无效死亡。
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">下列损失、费用和责任，保险人不负责赔偿:</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（一）被保险人的承包商工作人员的人身伤亡;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（二）被保险人应该承担的合同责任，但无合同存在时仍然应由被保险人承担的经济赔偿责任不在此限;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（三）罚款、罚金及惩罚性赔款;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（四）精神损害赔偿;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（五）间接损失;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（六）被保险人的工作人员因保险合同列明情形之外原因发生的医疗费用;</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">（七）本保险合同中载明的免赔额。</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold">其他不属于本保险责任范围内的损失、费用和责任，保险人不负责赔偿。</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div style="text-align: center"><h3> 中国人寿财产保险股份有限公司宁波市分公司</h3></div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="font-weight: bold"> 投保人声明：</div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="24">
              <div class="grid-content" style="text-indent: 2em">
                本人已收到并仔细阅读了贵公司提供的全部投保的保险条款。本人确认：贵公司已依法对保险合同的内容向本人作出说明；特别是保险合同中的免除保险人责任的条款，贵公司已依法向本人作出明确说明，并向本人进行了多次的提示，本人对保险条款中的保险责任、免除保险人责任的条款的概念、内容及法律后果均已充分理解并明了。特此声明！
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="19">
              <div class="grid-content" style="text-align: right;margin-right: 10px"> 投保人签章/签名:</div>
            </el-col>
            <el-col :span="4">

              <div style="width: 160px;" v-if="formData.signPolicyholder!=''">
                <el-image
                  style="width:100px; height: 100px"
                  :src="url+formData.signPolicyholder"
                  :preview-src-list="[url+formData.signPolicyholder]">
                </el-image>
              </div>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="19">
              <div class="grid-content" style="text-align: right;margin-right: 10px"> 日期:</div>
            </el-col>
            <el-col :span="4">
              <div> {{ formData.signPolicyholderTime }}</div>
            </el-col>
          </el-row>
        </div>
      </div>
      <!--       特别约定2-->


    </div>
    <div class="footer">
      <el-button type="primary" v-show="gotop" icon="el-icon-top" circle @click="toTop"></el-button>
    </div>
  </div>
</template>

<script>
import {listTemplate} from "@/api/base/template";
import {getInsureEli1} from '@/api/insurance/insureEli'
export default {
  name: "details1",
  data() {
    return {
      gotop: false,//回到顶部显示不显示
      url: process.env.VUE_APP_BASE_API,//地址
      title: '',
      isActive: 0,
      formData: {
        insure_id:'',//保单id
        user_id:'',//操作人id
        employerId1: '',//投保用工单位id
        employerId2: '',//被投保用工单位
        name1: '', //  投保人姓名
        contactPerson1: '',//投保人联系人姓名
        phone1: '',  // 投保人联系电话
        mailAddress1: '', //投保人通讯地址
        emailCode1: '',//投保人邮编
        email1: '', //  投保人电子邮箱
        name2: '', //被投保人名称
        contactPerson2: '',//被投保人联系姓名
        phone2: '', //  被投保联系方式
        mailAddress2: '', //投保人通讯地址
        emailCode2: '',//投保人邮编
        email2: '',//  被投保电子邮箱
        nature2: '', //  3被投保人性质
        industry: '',  //  所在行业
        address2: '',  //  被保险人地址/营业场所
        businessScope2: '',  // 被保险人营业范围
        staffCount2: '',  // 被保险人工作人员总人数
        seniorDescription: '', //   其中高级职员姓名，职务，健康情况，请说明：
        generalDescription: '', // 其他类型工作人员说明（如工作类型、人数、健康情况）
        // 7. 过去三年是否投保过与雇主责任相关的保险？ {{isELI1}}是     {{isELI0}}否
        isELI: '1',//是
        //过去三年损失情况如何  {{isLossEli1}}有    {{isLossEli0}}无
        isLossEli: '1',//有
        // 如果有，请说明：保险期间        保险人数                损失情况                获赔情况
        eliDesc: '',
        // 是否按照《工伤保险条例》参加工伤保险？    {{isII1}}是    {{isII0}}否
        isII: '0',//是
        // 如果是，过去三年被保险人参加工伤保险的情况：保险期间  保险人数  损失情况  获赔情况
        iiDesc: '',
        // 工作人员上岗前，是否经过岗位培训？    {{isTrain1}}是    {{isTrain0}}否
        isTrain: '1',//是
        trainingTime: '',    // 培训时间一般多长？
        // 是否拥有专职医疗人员？  {{isHaveMedicalStaff1}}有 {{isHaveMedicalStaff0}}无
        isHaveMedicalStaff: '0',//有
        medicalStaffCount: '', // 如果有，请列明数量
        hospitalDistance: '',    //      与最近的医院的距离
        hospitalName: '', //请提供医院名称
        // 是否全部工作人员参加医疗保险？       {{isJoinMi1}}是   {{isJoinMi0}}否
        isJoinMi: '0',
        descriptionMi: '',// 如果否，请说明情况：
        compPrincipleAndLimit: '', //13. 赔偿原则及限额
        otherDescription: '', //其他需要特别说明的情况
        insuranceTimeStart: '', // 16.保险期间：零时起
        insuranceTimeEnd: '',//二十四时止。
        sinsuranceFeeCounts: '',//17.总保险费（大写）
        sinsuranceFeeCount: '',//小写
        payTime: '',//18.保险费支付日期：
        solution: '1',//19.保险合同争议解决方式选择
        seal: '',//  投保人（签章）
        signingTime: '',//签章日期
        underwriting: '1',//承保性质
        agent: '',// 业务员/代理人姓名
        signPolicyholder: '',//   投保人（签章）
        signPolicyholderTime: '',//投保人（签章）日期
      },
      ProductPlan:[],//方案
    }
  },
  mounted() {
    // 此处true需要加上，不加滚动事件可能绑定不成功
    window.addEventListener("scroll", this.handleScroll, true);
  },
  methods: {
    //返回上一页
    getBack(){
      this.$router.back(-1);
    },
    //选择投保单类型
    getQuer() {
      listTemplate().then(response => {

        console.log('response', response)
        for (var i = 0; i < response.rows.length; i++) {
          if (response.rows[i].id == this.formData.templateId) {
            this.title = response.rows[i].name;
          }
        }
      })
    },
    handleScroll() {
      let scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
      // console.log('scrolltop',scrolltop)
      scrolltop > 30 ? (this.gotop = true) : (this.gotop = false);
    },
    //通过点击滚动回到顶部
    toTop() {

      let top = document.documentElement.scrollTop || document.body.scrollTop;
      // 实现滚动效果
      const timeTop = setInterval(() => {
        document.body.scrollTop = document.documentElement.scrollTop = top -= 50;
        if (top <= 0) {
          clearInterval(timeTop);
        }
      }, 10);
    },
  },
  created() {
    // this.formData = this.$route.query.insureInfo;
    console.log('formData', this.formData)
    this.getQuer();
    var formData=this.$route.query.insureInfo

    getInsureEli1(formData.id).then(res=>{
      console.log('详情',res);
      this.formData.insure_id=res.data.id;
      this.formData.employerId1=res.data.employer_id1;
      this.formData.employerId2=res.data.employer_id2;
      this.formData.name1=res.data.name1;
      this.formData.contactPerson1=res.data.contact_person1;
      this.formData.phone1=res.data.phone1;
      this.formData.mailAddress1=res.data.mail_address1;
      this.formData.emailCode1=res.data.email_code1;
      this.formData.email1=res.data.email1;
      this.formData.name2=res.data.name2;
      this.formData.contactPerson2=res.data.contact_person2;
      this.formData.phone2=res.data.phone2;
      this.formData.mailAddress2=res.data.mail_address2;
      this.formData.emailCode2=res.data.email_code2;
      this.formData.email2=res.data.email2;
      this.formData.nature2=res.data.nature2;
      if (this.formData.nature2 != null) {
        if (this.formData.nature2 == 0) {
          this.formData.nature2 = '国家机关'
        } else if (this.formData.nature2 == 1) {
          this.formData.nature2 = '事业单位'
        } else if (this.formData.nature2 == 2) {
          this.formData.nature2 = '社会团体'
        } else if (this.formData.nature2 == 3) {
          this.formData.nature2 = '学校'
        } else if (this.formData.nature2 == 4) {
          this.formData.nature2 = '企业'
        } else if (this.formData.nature2 == 6) {
          this.formData.nature2 = '个体工商户'
        }
      }
      this.formData.industry=res.data.industry;
      this.formData.address2=res.data.address2;
      this.formData.businessScope2=res.data.business_scope2;
      this.formData.staffCount2=res.data.staff_count2;
      this.formData.seniorDescription=res.data.senior_description;
      this.formData.generalDescription=res.data.general_description;
      if (res.data.is_e_l_i!=null){
        this.formData.isELI=res.data.is_e_l_i.toString();
      }
      if (res.data.


          is_loss_eli!=null){
        this.formData.isLossEli=res.data.is_loss_eli.toString();
      }
      this.formData.eliDesc=res.data.eli_desc;
      if (res.data.is_i_i!=null){
        this.formData.isII=res.data.is_i_i.toString();
      }

      this.formData.iiDesc=res.data.ii_desc;

      if (res.data.is_train!=null){
        this.formData.isTrain=res.data.is_train.toString();
      }

      this.formData.trainingTime=res.data.training_time;

      if (res.data.is_have_medical_staff!=null){
        this.formData.isHaveMedicalStaff=res.data.is_have_medical_staff.toString();
      }

      this.formData.medicalStaffCount=res.data.medical_staff_count;
      this.formData.hospitalDistance=res.data.hospital_distance;
      this.formData.hospitalName=res.data.hospital_name;
      if (res.data.is_join_mi!=null){
        this.formData.isJoinMi=res.data.is_join_mi.toString();
      }

      this.formData.descriptionMi=res.data.description_mi;
      this.formData.compPrincipleAndLimit=res.data.comp_principle_and_limit;
      this.formData.otherDescription=res.data.other_description;
      this.formData.insuranceTimeStart=res.data.insurance_time_start.substring(0,11);
      this.formData.insuranceTimeEnd=res.data.insurance_time_end.substring(0,11);
      this.formData.sinsuranceFeeCounts=res.data.sinsurance_fee_counts;
      this.formData.sinsuranceFeeCount=res.data.sinsurance_fee_count;
      if (res.data.pay_time!=''){
        if (res.data.pay_time!='0000-00-00 00:00:00'){

          this.formData.payTime=res.data.pay_time.substring(0,11);
        }
      }
      this.formData.solution=res.data.solution;
      this.formData.seal=res.data.seal;
      if (this.formData.seal!=""){
        this.urlImage1= this.formData.seal;
        if (this.urlImage1!=''){
          this.show1=false;
        }else {
          this.show1=true;
        }
      }
      if (res.data.signing_time!=''){
        if (res.data.signing_time!='0000-00-00 00:00:00'){
          this.formData.signingTime=res.data.signing_time.substring(0,10);
        }
      }

      this.formData.underwriting=res.data.underwriting;
      this.formData.agent=res.data.agent;
      this.formData.signPolicyholder=res.data.sign_policyholder;
      if (this.formData.signPolicyholder!=""){
        this.urlImage=this.formData.signPolicyholder
        if (this.urlImage!=''){
          this.show=false;
        }else {
          this.show=true;
        }
        // console.log('a',this.formData)
      }
      if (res.data.sign_policyholder_time!=''){

        if (res.data.sign_policyholder_time!='0000-00-00 00:00:00'){
          this.formData.signPolicyholderTime=res.data.sign_policyholder_time.substring(0,10);
        }
      }

      this.ProductPlan=res.data.plan
      //将int类型转换为string类型
      if (this.formData.isELI != null) {
        if (this.formData.isELI == 0) {
          this.formData.isELI = '否'
        } else if (this.formData.isELI == 1) {
          this.formData.isELI = '是'
        }
      }
      if (this.formData.isLossEli != null) {
        if (this.formData.isLossEli == 0) {
          this.formData.isLossEli = '无'
        } else if (this.formData.isELI == 1) {
          this.formData.isLossEli = '有'
        }
      }
      if (this.formData.isII != null) {
        if (this.formData.isII ==1) {
          this.formData.isII = '是'
        } else if (this.formData.isII == 0) {
          this.formData.isII = '否'
        }
      }
      if (this.formData.isTrain != null) {
        if (this.formData.isTrain == 1) {
          this.formData.isTrain = '是'
        } else if (this.formData.isTrain == 0) {
          this.formData.isTrain = '否'
        }
      }
      if (this.formData.isHaveMedicalStaff != null) {
        if (this.formData.isHaveMedicalStaff == 0) {
          this.formData.isHaveMedicalStaff = '无'
        } else if (this.formData.isHaveMedicalStaff == 1) {
          this.formData.isHaveMedicalStaff = '有'
        }

      }
      if (this.formData.isJoinMi != null) {
        if (this.formData.isJoinMi ==1) {
          this.formData.isJoinMi = '是'
        } else if (this.formData.isJoinMi ==0) {
          this.formData.isJoinMi = '否'
        }
      }
      if (this.formData.solution != null) {
        if (this.formData.solution == 1) {
          this.formData.solution = '提交仲裁委员会仲裁'
        } else if (this.formData.solution == 2) {
          this.formData.solution = '诉讼'
        }

      }
      if (this.formData.underwriting != null) {
        if (this.formData.underwriting == 1) {
          this.formData.underwriting = '新保'
        } else if (this.formData.underwriting == 2) {
          this.formData.underwriting = '续保'
        }

      }
      if (this.formData.insuranceTimeStart != null) {
        var y = this.formData.insuranceTimeStart.substring(0, 4);
        var m = this.formData.insuranceTimeStart.substring(5, 7);
        var d = this.formData.insuranceTimeStart.substring(8, 10);
        this.formData.insuranceTimeStart = y + "年" + m + "月" + d + '日';

        console.log('insuranceTimeStart', this.formData.insuranceTimeStart)
      }


      if (this.formData.signPolicyholderTime != null) {
        var y = this.formData.signPolicyholderTime.substring(0, 4);
        var m = this.formData.signPolicyholderTime.substring(5, 7);
        var d = this.formData.signPolicyholderTime.substring(8, 10);
        this.formData.signPolicyholderTime = y + "年" + m + "月" + d + '日';

        console.log('signPolicyholderTime', this.formData.signPolicyholderTime)
      }

    })


  }
}
</script>

<style scoped lang="scss">
.insureEli_conter {
  //background: #00afff;
  overflow: hidden;

  .footer {
    position: fixed;
    right: 50px;
    bottom: 80px;
    cursor: pointer;
    padding: 10px;
    border-radius: 50%;
    //background-color: #00afff;
  }

  .row_top {
    //background: #00afff;
    margin: 20px auto;

    .top_img {
      //background: pink;

      img {
        margin-left: 100px;
        //width: 500px;
      }
    }

    .grid-content {

      //background: #00afff;
      height: 62px;
      line-height: 62px;
      text-align: right;
      margin-right: 10px;
      min-width: 300px;
      max-width: 400px;

      span {
        margin-right: 5px;
      }
    }
  }


  .title {
    text-align: center;
    font-size: 20px;
    font-weight: bold;

    span {
      font-size: 16px;
      font-weight: normal;
      margin-left: 20px;
    }
  }

  .explain {
    text-indent: 2em;
    font-size: 14px;
    margin: 10px;

    span {
      font-weight: bold;
    }
  }

  .tem_from {
    //background: pink;
    padding: 20px;

    .infor {
      margin-top: 20px;
      //background: #4AB7BD;
      min-width: 500px;
      min-width: 100%;
      display: flex;
      flex-flow: wrap;
      align-items: center;
      justify-content: space-between;

      .el-input {
        width: 200px;
        //background: #00afff;
      }

      .el-input1 {
        width: 250px;
      }
    }

    .infor1 {
      margin-top: 20px;
      padding-left: 20px;
    }

    .infor1_Industry {
      display: flex;
      //background-color: pink;
      margin: 20px 0 20px 20px;
      align-items: center;

      span {
        display: inline-block;
        width: 150px;

        //background-color: #00afff;
      }

    }

    .infor2 {
      display: flex;
      //background-color: pink;
      margin: 20px auto;
      align-items: center;

      span {
        display: inline-block;
        width: 240px;
        //background-color: #00afff;
      }

      .input {
        width: 80px;
        margin-right: 5px;
      }
    }

    .el-row {
      margin-bottom: 20px;
      margin: 0 20px 20px;
      display: flex;
      flex-flow: wrap;
      align-items: center;

      .input1 {
        margin-left: 20px;
      }
    }

    .grid-content {
      margin-left: 20px;
      //background-color: pink;
      //height: 35px;
      //line-height: 35px;
    }

    .grid-content2 {
      font-weight: bold;
      text-align: center;
    }

    .bg-purple {
      font-weight: bold;
    }

    .conter {
      background-color: #f1f1f1;
      border-radius: 6px;
      padding: 20px;
      margin-bottom: 20px;
    }
  }

  .yinying {
    background-color: rgba(0, 0, 0, .4);
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }
}
</style>

